<template>
  <view class="page-wrap">
    <view class="field-box">
      <view class="field-item" v-for="col in fieldList">
        <view class="label">
          {{col.name||''}}:
        </view>
        <view class="value">
          {{detail[col.column]||'-'}}
        </view>
      </view>
    </view>
    <view class="field-box">
      <view class="field-item" v-for="col in fieldList1">
        <view class="label text-bold flex1">
          {{col.name||''}}
        </view>
        <view class="value text-gray">
          {{detail[col.column]||'-'}}
        </view>
      </view>
    </view>
    <view class="field-box">
      <view class="title">
        外调方案
      </view>
      <view class="fa-list" v-if="outChild.length>0">
        <view class="fa-item" v-for="item in outChild">
          <view class="fa-item-item">
            名称：{{item.goods_name||'-'}}
          </view>
          <view class="fa-item-item">
            说明：{{item.illustration||'-'}}
          </view>
          <view class="fa-item-item">
            单次数量：{{item.single_quantity||'-'}}
          </view>
          <view class="fa-item-item">
            单次单位：{{item.single_unit||'-'}}
          </view>
        </view>
      </view>
      <view class="fa-list hint" v-else>
        暂无记录
      </view>
    </view>
    <view class="field-box">
      <view class="title">
        内养方案
      </view>
      <view class="fa-list" v-if="innerChild.length>0">
        <view class="fa-item" v-for="item in innerChild">
          <view class="fa-item-item">
            名称：{{item.goods_name||'-'}}
          </view>
          <view class="fa-item-item">
            说明：{{item.illustration||'-'}}
          </view>
          <view class="fa-item-item">
            单次数量：{{item.single_quantity||'-'}}
          </view>
          <view class="fa-item-item">
            单次单位：{{item.single_unit||'-'}}
          </view>
        </view>
      </view>
      <view class="fa-list hint" v-else>
        暂无记录
      </view>
    </view>
    <view class="field-box">
      <view class="field-item" v-for="col in fieldList2">
        <view class="label text-bold flex1">
          {{col.name||''}}
        </view>
        <view class="value text-gray">
          {{detail[col.column]||'-'}}
        </view>
      </view>
    </view>
    <view class="field-box">
      <view class="field-item" v-for="col in fieldList3">
        <view class="label text-bold">
          {{col.name||''}}:
        </view>
        <view class="value">
          {{detail[col.column]||'-'}}
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  const fieldList = [{
      name: '方案编号',
      column: 'hp_no'
    },
    {
      name: '方案名称',
      column: 'hp_name'
    },
    {
      name: '会员姓名',
      column: 'hy_name'
    },

    {
      name: '体质类别',
      column: 'physical_name'
    },
    {
      name: '能量值',
      column: 'energy_value'
    },

    {
      name: '重症风险度',
      column: 'critical_disease_risk'
    },

    {
      name: '血糖值',
      column: 'blood_sugar_value'
    },

    {
      name: '血压值',
      column: 'blood_pressure_value'
    },

  ]
  const fieldList1 = [
    
    {
      name: '方案辨证记录',
      column: 'dialectical_record'
    }
  ]
  const fieldList2 = [{
    name: '用药方案',
    column: 'medication_regimen'
  }]

  const fieldList3 = [{
      name: '开药医生',
      column: 'medicine_doctor'
    },
    {
      name: '制定人',
      column: 'making_people'
    },

    {
      name: '方案总金额',
      column: 'money_total'
    }
  ]
  export default {
    data() {
      return {
        fieldList: Object.freeze(fieldList),
        fieldList1:Object.freeze(fieldList1),
        fieldList2: Object.freeze(fieldList2),
        fieldList3: Object.freeze(fieldList3),
        detail: {},
        hp_no: "",
        childData: []
      }
    },
    computed: {
      outChild() {
        if (Array.isArray(this.childData) && this.childData.length > 0) {
          return this.childData.filter(item => item.goods_type === '外调')
        } else {
          return []
        }
      },
      innerChild() {
        if (Array.isArray(this.childData) && this.childData.length > 0) {
          return this.childData.filter(item => item.goods_type === '内养')
        } else {
          return []
        }
      }
    },
    methods: {
      getDetailList() {
        let app = uni.getStorageSync('activeApp');
        let srevice = 'srvfyzh_health_programme_goods_select'
        let url = this.getServiceUrl(app, srevice, 'select');
        let req = {
          "serviceName": "srvfyzh_health_programme_goods_select",
          "colNames": ["*"],
          "condition": [{
            "colName": "progm_no",
            "ruleType": "eq",
            "value": this.hp_no
          }],
          "page": {
            "pageNo": 1,
            "rownumber": 50
          }
        }
        this.$http.post(url, req).then(res => {
          if (res.data.state === 'SUCCESS') {
            this.childData = res.data.data
          }
        })
      },
      getDetail() {
        let app = uni.getStorageSync('activeApp');
        let srevice = 'srvfyzh_health_programme_select'
        let url = this.getServiceUrl(app, srevice, 'select');
        let req = {
          serviceName: srevice,
          colNames: ['*'],
          condition: [{
            colName: 'hp_no',
            ruleType: 'eq',
            value: this.hp_no
          }],
          page: {
            pageNo: 1,
            rownumber: 1
          }
        };
        this.$http.post(url, req).then(res => {
          if (res.data.state === 'SUCCESS' && Array.isArray(res.data.data) && res.data.data.length > 0) {
            let detail = res.data.data[0]
            if (typeof detail === 'object') {
              let result = {}
              for (let key in detail) {
                result[key] = detail[key] ? detail[key] : detail[key] === 0 ? '0' : '-'
              }
              this.detail = result
            }
          }
        })
      }
    },
    onLoad(option) {
      if (option.hp_no) {
        this.hp_no = option.hp_no
        this.getDetail()
        this.getDetailList()
      }
    }
  }
</script>

<style lang="scss" scoped>
  .field-box {
    display: flex;
    flex-wrap: wrap;
    background-color: #fff;
    border-radius: 10px;
    padding: 10px;
    margin: 10px;

    .title {
      font-weight: bold;
      width: 100%;
      // margin-bottom: 10px;
    }
  }

  .field-item {
    display: flex;
    align-items: center;
    min-width: 50%;
    padding-right: 10px;
    flex-wrap: wrap;
    .label {
      margin-right: 10px;
      // min-width: 80px;
      // text-align: right;
      color: #333;
      &.flex1{
        width: 100%;
      }
    }

    .value {
      flex: 1;
      padding: 5px 0;
      border-radius: 5px;
    }
  }

  .text-gray{
    color: #ADAEBB;
  }
  .fa-list {
    padding: 5px 0;

    &.hint {
      color: #ADAEBB;
    }

    .fa-item {
      color: #ADAEBB;
      display: flex;
      flex-wrap: wrap;
      padding: 5px 0;
      border-bottom: 1px solid #F1F1F1;

      &:last-child {
        border-bottom: none;
      }

      .fa-item-item {
        min-width: 50%;
      }
    }
  }
</style>
